<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    </style>
</head>
<body>

    <div class="cont">
        <div class="box">
        </div>
        <textarea id="txt"></textarea>
        <input type="button" value="发送" id="send">
    </div>

</body>
<script>

    // 获取元素
    var oBox = document.querySelector(".box")
    var oTxt = document.querySelector("#txt")
    var oSend = document.querySelector("#send")

    // 绑定事件
    oSend.onclick = function(){
        send();
    }

    oTxt.onkeydown = function(eve){
        var e = eve || window.event;
        var code = e.keyCode || e.which;
        // 回车发送
        if(code === 13){
            send();
        }
        // ctrl + 回车发送
        if(code === 13 && e.ctrlKey){
            send();
        }
    }


    function send(){
        // 创建元素
        var p = document.createElement("p")
        // 获取内容并设置到创建的元素
        p.innerHTML = oTxt.value;
        // 插入到容器
        oBox.appendChild(p);
        // 清空输入框
        oTxt.value = "";
    }



    
</script>
</html>